<template>
  <div class="border">
    <h3>这是childCom2组件</h3>
    <p>boo:{{ boo }}</p>
    <p>childCom2的$attrs {{ $attrs }}</p>
    <child-com3 v-bind="$attrs" v-on="$listeners"></child-com3>
  </div>
</template>
<script>
const childCom3 = () => import('./childCom3.vue');
export default {
  // props: {
  //   boo: String
  // },
  props: ['boo'],
  // 值为true的话{coo: "css", doo: "vue", p-child: "从公已觉十年迟", title: "前端工匠"},this.$attrs这个对象中的属性都会渲染在本子组件的根节点
  inheritAttrs: false, // 设置值为false可以自动关闭挂载在组件根元素上没有在props声明的属性的渲染
  components: {
    'child-com3': childCom3
  },
  created() {
    console.log(this.$attrs); // {coo: "css", doo: "vue", p-child: "从公已觉十年迟", title: "前端工匠"}
  }
};
</script>
<style lang="less" scoped></style>
